<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>"/>
<meta charset="utf-8" />
<link rel="shortcut icon" href="images/store.png"/><!--图片logo  -->
<title>B2B移动端下单平台</title>
<meta name="description" content="weishop">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name='apple-touch-fullscreen' content='yes'>
<meta name="full-screen" content="yes">
<link href="//m.hnhcyy.com" rel="dns-prefetch">
<link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
<link href="css/global.css?v=0715" rel="stylesheet" />
<link href="css/index.css?v=071502" rel="stylesheet" />
<link href="css/toTop.css?v=0715" rel="stylesheet" />
<script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script>
function nofound(spid,e){//未找到图片
	var e = e || window.event;
	var img=e.srcElement||e.target;
	console.log(spid);
	img.src="//www.hnhcyy.com/resource/img/"+spid+"/0.jpg"; 
	img.onerror=null;// 控制不要一直跳动  
}
</script>
</head>
<body>
	<div class="pagetop">
	<header class="search_top" align="center">
			<span>
				<a href="login?sjid=${sjid}"> <img class="my"
						src="images/my_acount.png">
				</a>
			</span>
			<span class="m_title">
				<input placeholder="搜索商品" name="q" value=""
									class="search-input" type="search" accesskey="s">
				<img class="search_button" src="images/search_btn.png">
			</span>
			<span id="search_action"><img id='search_icon' class="search"
					src="images/search_list.png">
			</span>
	</header>
	</div>
    <div id='slider' class='swipe'>
	  <div class='swipe-wrap'>
	  	<c:if test="${sjid==1}">
	    <!-- <div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_07.jpg" width="100%" height="100%" />
			<div id="time"></div>
			<script src="js/time_count.js"></script>
			<script>
           		var endtime = '2017-07-25';
         		setInterval(function(){
         			var timeNode = createTimeNode("2017-07-15",endtime);
         			$("#time").html("<span>抢购倒计时:</span>"+timeNode);
         		},1000)
         	</script>
		</div> -->
		<div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_11.jpg?v=0715" width="100%" height="100%" />  
	    </div>
		<div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_10.jpg?v=0715" width="100%" height="100%" />  
	    </div>
		<div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_09.jpg?v=0715" width="100%" height="100%" />  
	    </div>
	    <div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_02.jpg?v=0715" width="100%" height="100%" />  
	    </div>
	    <div class='wrap'>
	    	  <img src="images/lsx/lunbo_lsx_01.jpg?v=0715" width="100%" height="100%" />  
	    </div>
	    </c:if>
	    <c:if test="${sjid==2}">
	    <div class='wrap'>
	    	  <img src="images/zat/lunbo_zat_05.jpg" width="100%" height="100%" />
			<div id="time"></div>
			<script src="js/time_count.js"></script>
			<script>
           		var endtime = '2017-07-28 12:00:00';
         		setInterval(function(){
         			var timeNode = createTimeNode("2017-07-15",endtime);
         			$("#time").html("<span>抢购倒计时:</span>"+timeNode);
         		},1000)
         	</script>
		</div>
	    <div class='wrap'>
	    	  <img src="images/zat/lunbo_zat_03.jpg" width="100%" height="100%" />  
	    </div>
	    <div class='wrap'>
	    	  <img src="images/zat/lunbo_zat_01.jpg" width="100%" height="100%" />  
	    </div>
	    </c:if>
	  </div>
	</div>            
    <div class="list_container clearfix">
         <c:forEach items="${productList}" var="product">
             <a href="javascript:;" class="pop-itema" spid="${product.spid}">
                 <div class="pop_item">
                     <div class="pop_img">
                         <%-- <img class="lazy" src="images/product/${product.spid}/0.jpg" onerror="nofound('${product.spid}')"/> --%>
                         <img class="lazy"  
                         alt="${product.spmch}" src="http://www.hnhcyy.com/resource/img/${product.spid}/10.jpg" onerror="nofound('${product.spid}')"/>
                         <noscript><img src="http://www.hnhcyy.com/resource/img/${product.spid}/10.jpg" width="640" height="480"></noscript>
                     </div>
                     <div class="pop_price">
                          <span>${product.spmch}</span>
                          <c:if test="${product.productBal[0].kxshl==0}">
                          	<span style="color:#da0203;display:-webkit-inline-box">缺货</span>
                          </c:if>
                     </div>
                     <c:if test="${url!=null}">
                     	<span style="color:#da0203" class="time-count" data-endtime="${product.zengsong.fendtime}">
                     	</span>
                     </c:if>
                 </div>
             </a>
         </c:forEach>
         			<script src="js/time_count.js"></script>
         			<script>
         				timerun();
         				function timerun(){
         					var timecount = document.querySelectorAll(".time-count");
         					/* for(var i=0;i<timecount.length;i++){
         						var tc = timecount[i];
	         					var endtime = tc.getAttribute("data-endtime");
	         					console.log(endtime);
	                     		setInterval(function(){
	                     			var timeNode = createTimeNode("2017-07-15",endtime);
	                     			tc.innerHTML = "还剩："+ timeNode;
	                     		},1000)
         					} */
         					var timecount = $(".time-count");
         					timecount.each(function(){
	         					var _this = $(this);
	         					var endtime = _this.data("endtime");
	         					console.log(endtime);
	                     		setInterval(function(){
	                     			var timeNode = createTimeNode("2017-07-15",endtime);
	                     			_this.html("还剩："+timeNode);
	                     		},1000)
         					})
         				}
                 	</script>
    </div>
    <div id="search_page" class="hide">
        <div class="search_head" style="color:white">
            商品分类
            <a class="search_btn" id="search_back">返回</a>
        </div>
        <ul class="search_links" >
            <li class="search_link">
                <span class="arrow"></span>
                <ul class="search_subs">
                    <li class="search_sub"></li>
                    <li class="search_sub"></li>
                </ul>
            </li>
            <c:forEach items="${leibieList}" var="leibie">
                <li class="search_link"><a id='leibie' href="ProductList?leibie=${leibie.fid}&sjid=${sjid}">${leibie.fname}</a></li>
            </c:forEach>
        </ul>
    </div>
    <div class="weui-loadmore">
		<i class="weui-loading"></i> <span class="weui-loadmore__tips">正在加载</span>
	</div>
  	
	<!--返回顶部  -->
	<div class="return top">
    	<a href="javascript:;"><img src="//s.juancdn.com/jpwebapp_v1/images_v1/icon/back-top.png?ts=43cd703b21136a3e_1480432233"></a>
	</div>
	<!--返回首页  -->
	<div class="return home">
    	<a href="index?sjid=${sjid}"><img src="images/logos/home.png"></a>
	</div>
    <div class="footer_container">
        <div id="top_line"></div>
        <div id="bottom_rights">
            <p style="font-size:12px">&copy;湖南恒昌医药有限公司</p>
        </div>
    </div>
    <jsp:include page="part/index-foot.jsp"></jsp:include>
<!-- <script src="//cdn.bootcss.com/jquery_lazyload/1.9.7/jquery.lazyload.js"></script> -->
<script src="js/swipe.js"></script>
<script src="js/search.js"></script>
<script src="js/global.js?v=0715"></script>
<script src="js/post.js"></script>    
<script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script>
<script src="js/search4index.js?v=0715"></script>
<script>
	window.mySwipe = new Swipe(document.getElementById('slider'), {
	  startSlide: 0,
	  speed: 1000,
	  auto: 3000,
	  continuous: true,
	  disableScroll: false,
	  stopPropagation: false,
	  callback: function(index, elem) {},
	  transitionEnd: function(index, elem) {}
	});
    var leibie=<%=request.getParameter("leibie")%>;
    var tejia=<%=request.getParameter("tejia")%>;
    var sjid=${sjid};
    var user='${user}';
    if(user){//登录后可以加载更多
    	$.getScript("js/addmore4index.js?v=051302");
    }else{
    	$(".weui-loadmore").empty().html("登录后可查看更多");
    }
    $('#search_action').click(function () {
        $('#search_page').removeClass('hide').addClass('show');
    });
    $(".search_btn").click(function () {
        search_page.hide_page();
    });
     //点击外侧区域，隐藏分类
     $(document).on ('click',function (e){
    	var e = e || window.event;
        var target = e.srcElement|| e.target;
    	if ($('#search_page').hasClass('show') && target.id != 'search_icon' && target.id != 'leibie'){
    		search_page.hide_page();
    		return false;
     	}
	})
	
	$(document).on("click",".pop-itema",function(e){
        	e = e || window.event;
            var target = e.srcElement|| e.target;
        	if ($('#search_page').hasClass('show') && target.id != 'search_icon' && target.id != 'leibie'){
        		search_page.hide_page();
         	}else{
				var productid=$(this).attr("spid");
				var form = new CodeSTD.form({
			        url:'Shop/Detail?sjid='+sjid,
			        method:'POST',
			        params:{productid:productid}
			    })
				$(form).submit();
				form = null;
         	}
	})
	var initsize=$(".pop-itema").length;
	if(initsize<12 && "${url}")$(".weui-loadmore").hide();
	
	/* var state = { //这里可以是你想给浏览器的一个State对象，为后面的StateEvent做准备。
			title : "test",
			url : "index"
		};
	history.pushState(state, "test", "index");
	window.addEventListener('popstate', function(e){ 
		if (history.state){ 
			var state = e.state; 
			alert("我监听到了浏览器的返回按钮事件啦"); 
		} 
	}, false); */
</script>
</body>
</html>